.container {
  width: 70vw;
  margin: auto;
  border: 1px solid #ccc;
  padding: 18px;

  .chart {
    height: 60vh;
    z-index: 1;
    width: calc(100% - 200px);
    min-height: 60vh;
    color: #fafaff;
    border-radius: 0.5em;
    div {
      width: 100%;
      height: 100%;
    }
  }

  .slider {
    width: calc(100% - 200px);
    height: 62px;
    border-radius: 4px;
    :global {
      .ant-slider {
        height: 20px;
      }
      .ant-slider-handle-1 {
        margin-top: 4.5px;
        background: #7c8b8f00;
        border: none;
        border-radius: 7px 0px 0px 7px;
      }
      .ant-slider-handle-2 {
        margin-top: 4.5px;
        background: #06127f00;
        border: none;
        border-radius: 0px 7px 7px 0px;
      }
      .ant-slider-rail {
        height: 14px;
        background: #e6e6e6;
        border-radius: 8px;
        box-shadow: 1px 1px 5px rgb(133, 129, 129) inset;
      }
      .ant-slider-step {
        display: none;
      }
      .ant-slider-track {
        height: 12px;
        margin-top: 1px;
        background: linear-gradient(45deg, #26b6d5, #06127f94) !important;
        border-radius: 8px 8px 8px 8px;
      }
      .ant-slider-mark {
        top: 24px;
      }
    }
  }
}
